<template>
	<view class="payments_wrap">
		<view class="orders">
			<view>
				<view>订单</view>
				<view>{{ orderCount }}</view>
			</view>
			<view class="separate"></view>
			<view>
				<view>总额</view>
				<view>￥{{ totalPrice }}</view>
			</view>
		</view>
		<view class="time_choose">
			<picker mode="date" :value="date" fields="month" start="2021-1" :end="endDate" @change="bindDateChange">
				<view class="uni-input">{{ date }}</view>
			</picker>
			<picker mode="date" :value="date" fields="month" start="2021-1" :end="endDate" @change="bindDateChange">
				<image src="https://res.jiuzhang-cloud.com/jzy-oss/upload/image/dti-hospital/agencies/arrow_list.png"
					mode=""></image>
			</picker>
		</view>
		<view class="ward" v-for="(item, index) in records" :key="index">
			<view class="amount">
				<view>{{ item.busTypeName }}</view>
				<view :style="item.amount < 0 ? 'color:#006DFF' : 'color:#FC4E4C'">{{ item.amount > 0 ? ('+￥' +
						item.amount)
						: (item.amount.slice(0, 1) + '￥' + item.amount.slice(1))
				}}</view>
			</view>
			<view>
				<view class="orders">
					<view>
						<image
							src="https://res.jiuzhang-cloud.com/jzy-oss/upload/image/dti-hospital/agencies/orders_number.png">
						</image>
						<view>订单号</view>
					</view>
					<view>{{ item.orderCode }}
					</view>
				</view>
				<view class="orders">
					<view>
						<image
							src="https://res.jiuzhang-cloud.com/jzy-oss/upload/image/dti-hospital/agencies/orders_time.png">
						</image>
						<view>订单时间</view>
					</view>
					<view>{{ item.createdTime }}
					</view>
				</view>
			</view>
		</view>
		<u-empty-state v-if="records.length == 0" value="暂无相关记录"></u-empty-state>
	</view>
</template>

<script>
import uSettlement from '../components/u-settlement/u-settlement.vue'
export default {
	components: {
		uSettlement
	},
	onShow() {
		this.getOrdersLise()
	},
	onReachBottom() {
		if (this.pageNo * 10 < this.total) {
			this.pageNo++
			this.getOrdersLise()
		}
	},
	data() {
		const currentDate = this.getDate({
			format: true
		})
		return {
			add_sub: false,
			orderCount: 0,  //订单数
			totalPrice: '0',  //总金额
			total: 0,  //总数据
			records: [],     //记录列表
			date: currentDate,
			endDate: currentDate,
			pageNo: 1
		};
	},
	computed: {
	},
	methods: {
		getOrdersLise() {
			this.$api.getOrdersLise({
				params: {
					month: this.date.slice(0, -3) + this.date.slice(-2),
					pageSize: 10,
					pageNo: this.pageNo
				}
			}).then(e => {
				const {
					code,
					result: {
						page,
						orderCount,
						totalPrice,

					}
				} = e
				if (code == 200) {
					this.orderCount = orderCount;
					this.totalPrice = totalPrice;
					this.total = page.total
					if (page) {
						this.records.push.apply(this.records, page.records);
					}
				} else {
					uni.showToast({
						title: e.message,
						icon: 'none'
					});
				}
			}).catch(err => {
				console.log(err)
			})
		},
		bindDateChange(e) {  //切换日期
			this.date = e.detail.value
			this.pageNo = 1
			this.records = []
			this.getOrdersLise()
		},
		getDate() {
			const date = new Date();
			let year = date.getFullYear();
			let month = date.getMonth() + 1;
			month = month > 9 ? month : '0' + month;
			return `${year}-${month}`;
		}
	}
}
</script>

<style lang="less">
@import './payments.less';
</style>
